--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Node / ReticulumProjects / MeshChatX.git / files / meshchatx / src / frontend / components / messages / AudioWaveformPlayer.vue
Displaying Raw • Download
meshchatx/src/frontend/components/messages/AudioWaveformPlayer.vue 559f6bc8f25bbb9ee5b81bcd4e39939f8a24b374 (559f6bc8) Text, 10.28 KB
Tb4b4b4<Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3classTff7b72=Ta5d6ff"audio-waveform-player flex items-center gap-3 p-2 rounded-xl transition-all w-full min-w-0"
Tb4b4b4:Te6edf3classTff7b72=Ta5d6ff"Tb4b4b4[
Te6edf3isOutbound Tff7b72? Ta5d6ff'bg-white/10 text-white' Tff7b72: Ta5d6ff'bg-gray-100 dark:bg-zinc-800/80 text-gray-800 dark:text-zinc-200'Tb4b4b4,
Tb4b4b4]Ta5d6ff"
Tb4b4b4>
T8b949e<!-- Play/Pause Button -->
Tb4b4b4<Tff7b72button
Te6edf3classTff7b72=Ta5d6ff"flex items-center justify-center size-10 rounded-full shrink-0 transition-all active:scale-90"
Tb4b4b4:Te6edf3classTff7b72=Ta5d6ff"Tb4b4b4[
Te6edf3isOutbound Tff7b72? Ta5d6ff'bg-white/20 hover:bg-white/30 text-white' Tff7b72: Ta5d6ff'bg-blue-500 hover:bg-blue-600 text-white'Tb4b4b4,
Tb4b4b4]Ta5d6ff"
Tb4b4b4@Te6edf3clickTff7b72=Ta5d6ff"Te6edf3togglePlayTa5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Tb4b4b4:Te6edf3icon-nameTff7b72=Ta5d6ff"Te6edf3isPlaying Tff7b72? Ta5d6ff'pause' Tff7b72: Ta5d6ff'play'Ta5d6ff" Te6edf3classTff7b72=Ta5d6ff"size-6" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
T8b949e<!-- Waveform and Progress -->
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"flex-1 relative h-11 group cursor-pointer min-w-0" Tb4b4b4@Te6edf3mousedownTff7b72=Ta5d6ff"Te6edf3handleWaveformClickTa5d6ff"Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3loadingTa5d6ff" Te6edf3classTff7b72=Ta5d6ff"absolute inset-0 flex items-center justify-center"Tb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3classTff7b72=Ta5d6ff"size-4 border-2 border-current/20 border-t-current rounded-full animate-spin opacity-50"
Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tff7b72canvas Te6edf3v-showTff7b72=Ta5d6ff"Tff7b72!Te6edf3loadingTa5d6ff" Te6edf3refTff7b72=Ta5d6ff"waveform" Te6edf3classTff7b72=Ta5d6ff"w-full h-full"Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72canvasTb4b4b4>
T8b949e<!-- Progress Line -->
Tb4b4b4<Tff7b72div
Te6edf3v-ifTff7b72=Ta5d6ff"Tff7b72!Te6edf3loading Tff7b72&& Tb4b4b4(Te6edf3isPlaying Tff7b72|| Te6edf3progressPercent Tff7b72> T79c0ff0Tb4b4b4)Ta5d6ff"
Te6edf3classTff7b72=Ta5d6ff"absolute top-0 bottom-0 w-0.5 bg-blue-400 z-10 pointer-events-none transition-[left] duration-100 ease-linear"
Tb4b4b4:Te6edf3styleTff7b72=Ta5d6ff"Tb4b4b4{ Te6edf3leftTff7b72: Te6edf3progressPercent Tff7b72+ Ta5d6ff'%' Tb4b4b4}Ta5d6ff"
Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
T8b949e<!-- Hover Seek Line -->
Tb4b4b4<Tff7b72div
Te6edf3classTff7b72=Ta5d6ff"absolute top-0 bottom-0 w-px bg-current opacity-0 group-hover:opacity-20 z-0 pointer-events-none"
Tb4b4b4:Te6edf3styleTff7b72=Ta5d6ff"Tb4b4b4{ Te6edf3leftTff7b72: Te6edf3hoverPercent Tff7b72+ Ta5d6ff'%' Tb4b4b4}Ta5d6ff"
Tb4b4b4>Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
T8b949e<!-- Time Info -->
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"text-[10px] font-mono opacity-60 tabular-nums select-none shrink-0 pr-1"Tb4b4b4>
Tff7b72{{ Te6edf3formatTimeTb4b4b4(Te6edf3currentTimeTb4b4b4) Tff7b72}} / Tff7b72{{ Te6edf3formatTimeTb4b4b4(Te6edf3totalDurationTb4b4b4) Tff7b72}}
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72scriptTb4b4b4>
Tff7b72import Te6edf3MaterialDesignIcon Tff7b72from Ta5d6ff"../MaterialDesignIcon.vue"Tb4b4b4;
Tff7b72export Tff7b72default Tb4b4b4{
Te6edf3nameTff7b72: Ta5d6ff"AudioWaveformPlayer"Tb4b4b4,
Te6edf3componentsTff7b72: Tb4b4b4{
Te6edf3MaterialDesignIconTb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3propsTff7b72: Tb4b4b4{
Te6edf3srcTff7b72: Tb4b4b4{
Te6edf3typeTff7b72: Tffa657StringTb4b4b4,
Te6edf3requiredTff7b72: Tff7b72trueTb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3isOutboundTff7b72: Tb4b4b4{
Te6edf3typeTff7b72: Tffa657BooleanTb4b4b4,
Tff7b72defaultTff7b72: Tff7b72falseTb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3emitsTff7b72: Tb4b4b4[Ta5d6ff"play"Tb4b4b4]Tb4b4b4,
Te6edf3dataTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Tb4b4b4{
Te6edf3loadingTff7b72: Tff7b72trueTb4b4b4,
Te6edf3audioBufferTff7b72: Tff7b72nullTb4b4b4,
Te6edf3audioContextTff7b72: Tff7b72nullTb4b4b4,
Te6edf3sourceNodeTff7b72: Tff7b72nullTb4b4b4,
Te6edf3totalDurationTff7b72: T79c0ff0Tb4b4b4,
Te6edf3currentTimeTff7b72: T79c0ff0Tb4b4b4,
Te6edf3isPlayingTff7b72: Tff7b72falseTb4b4b4,
Te6edf3playbackStartTimeTff7b72: T79c0ff0Tb4b4b4,
Te6edf3playbackStartOffsetTff7b72: T79c0ff0Tb4b4b4,
Te6edf3progressPercentTff7b72: T79c0ff0Tb4b4b4,
Te6edf3hoverPercentTff7b72: T79c0ff0Tb4b4b4,
Te6edf3animationFrameTff7b72: Tff7b72nullTb4b4b4,
Te6edf3darkObserverTff7b72: Tff7b72nullTb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3watchTff7b72: Tb4b4b4{
Te6edf3srcTff7b72: Tb4b4b4{
Te6edf3immediateTff7b72: Tff7b72trueTb4b4b4,
Te6edf3handlerTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3loadAudioTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3mountedTb4b4b4(Tb4b4b4) Tb4b4b4{
Tffa657windowTb4b4b4.Te6edf3addEventListenerTb4b4b4(Ta5d6ff"resize"Tb4b4b4, Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3darkObserver Tff7b72= Tff7b72new Te6edf3MutationObserverTb4b4b4(Tb4b4b4(Tb4b4b4) Tb4b4b4=> Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4(Tb4b4b4)Tb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3darkObserverTb4b4b4.Te6edf3observeTb4b4b4(Tffa657documentTb4b4b4.Te6edf3documentElementTb4b4b4, Tb4b4b4{ Te6edf3attributesTff7b72: Tff7b72trueTb4b4b4, Te6edf3attributeFilterTff7b72: Tb4b4b4[Ta5d6ff"class"Tb4b4b4] Tb4b4b4}Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3beforeUnmountTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3stopPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4;
Tffa657windowTb4b4b4.Te6edf3removeEventListenerTb4b4b4(Ta5d6ff"resize"Tb4b4b4, Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3darkObserverTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3darkObserverTb4b4b4.Te6edf3disconnectTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3darkObserver Tff7b72= Tff7b72nullTb4b4b4;
Tb4b4b4}
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3closeTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3methodsTff7b72: Tb4b4b4{
Tff7b72async Te6edf3loadAudioTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72!Tff7b72thisTb4b4b4.Te6edf3srcTb4b4b4) Tff7b72returnTb4b4b4;
Tff7b72try Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3loading Tff7b72= Tff7b72trueTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3stopPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3response Tff7b72= Tff7b72await Te6edf3fetchTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3srcTb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72!Te6edf3responseTb4b4b4.Te6edf3okTb4b4b4) Tb4b4b4{
Tff7b72throw Tff7b72new Tf85149ErrorTb4b4b4(Ta5d6ff`Ta5d6ffHTTP error! status: Tffd700${Te6edf3responseTb4b4b4.Te6edf3statusTffd700}Ta5d6ff`Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tff7b72const Te6edf3arrayBuffer Tff7b72= Tff7b72await Te6edf3responseTb4b4b4.Te6edf3arrayBufferTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72!Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3audioContext Tff7b72= Tff7b72new Tb4b4b4(Tffa657windowTb4b4b4.Te6edf3AudioContext Tff7b72|| Tffa657windowTb4b4b4.Te6edf3webkitAudioContextTb4b4b4)Tb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3audioBuffer Tff7b72= Tff7b72await Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3decodeAudioDataTb4b4b4(Te6edf3arrayBufferTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3totalDuration Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioBufferTb4b4b4.Te6edf3durationTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72= T79c0ff0Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3progressPercent Tff7b72= T79c0ff0Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3$nextTickTb4b4b4(Tb4b4b4(Tb4b4b4) Tb4b4b4=> Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4)Tb4b4b4;
Tb4b4b4} Tff7b72catch Tb4b4b4(Te6edf3eTb4b4b4) Tb4b4b4{
Te6edf3consoleTb4b4b4.Te6edf3errorTb4b4b4(Ta5d6ff"Failed to load audio for player:"Tb4b4b4, Te6edf3eTb4b4b4)Tb4b4b4;
Tb4b4b4} Tff7b72finally Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3loading Tff7b72= Tff7b72falseTb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3drawWaveformTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3canvas Tff7b72= Tff7b72thisTb4b4b4.Te6edf3$refsTb4b4b4.Te6edf3waveformTb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72!Te6edf3canvas Tff7b72|| Tff7b72!Tff7b72thisTb4b4b4.Te6edf3audioBufferTb4b4b4) Tff7b72returnTb4b4b4;
Tff7b72const Te6edf3ctx Tff7b72= Te6edf3canvasTb4b4b4.Te6edf3getContextTb4b4b4(Ta5d6ff"2d"Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3width Tff7b72= Te6edf3canvasTb4b4b4.Te6edf3clientWidthTb4b4b4;
Tff7b72const Te6edf3height Tff7b72= Te6edf3canvasTb4b4b4.Te6edf3clientHeightTb4b4b4;
Te6edf3canvasTb4b4b4.Te6edf3width Tff7b72= Te6edf3width Tff7b72* Tffa657windowTb4b4b4.Te6edf3devicePixelRatioTb4b4b4;
Te6edf3canvasTb4b4b4.Te6edf3height Tff7b72= Te6edf3height Tff7b72* Tffa657windowTb4b4b4.Te6edf3devicePixelRatioTb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3scaleTb4b4b4(Tffa657windowTb4b4b4.Te6edf3devicePixelRatioTb4b4b4, Tffa657windowTb4b4b4.Te6edf3devicePixelRatioTb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3data Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioBufferTb4b4b4.Te6edf3getChannelDataTb4b4b4(T79c0ff0Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3step Tff7b72= Tffa657MathTb4b4b4.Te6edf3ceilTb4b4b4(Te6edf3dataTb4b4b4.Te6edf3length Tff7b72/ Te6edf3widthTb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3amp Tff7b72= Te6edf3height Tff7b72/ T79c0ff2Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3clearRectTb4b4b4(T79c0ff0Tb4b4b4, T79c0ff0Tb4b4b4, Te6edf3widthTb4b4b4, Te6edf3heightTb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3dark Tff7b72= Tff7b72thisTb4b4b4.Te6edf3isDarkModeTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3waveBg Tff7b72= Te6edf3dark Tff7b72? Ta5d6ff"rgba(255, 255, 255, 0.3)" Tff7b72: Ta5d6ff"rgba(0, 0, 0, 0.2)"Tb4b4b4;
Tff7b72const Te6edf3waveFg Tff7b72= Te6edf3dark Tff7b72? Ta5d6ff"#fff" Tff7b72: Ta5d6ff"#000"Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3beginPathTb4b4b4(Tb4b4b4)Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3strokeStyle Tff7b72= Te6edf3waveBgTb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3lineWidth Tff7b72= T79c0ff1.5Tb4b4b4;
Tff7b72for Tb4b4b4(Tff7b72let Te6edf3i Tff7b72= T79c0ff0Tb4b4b4; Te6edf3i Tff7b72< Te6edf3widthTb4b4b4; Te6edf3iTff7b72++Tb4b4b4) Tb4b4b4{
Tff7b72let Te6edf3min Tff7b72= T79c0ff1.0Tb4b4b4;
Tff7b72let Te6edf3max Tff7b72= Tff7b72-T79c0ff1.0Tb4b4b4;
Tff7b72for Tb4b4b4(Tff7b72let Te6edf3j Tff7b72= T79c0ff0Tb4b4b4; Te6edf3j Tff7b72< Te6edf3stepTb4b4b4; Te6edf3jTff7b72++Tb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3datum Tff7b72= Te6edf3dataTb4b4b4[Te6edf3i Tff7b72* Te6edf3step Tff7b72+ Te6edf3jTb4b4b4]Tb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3datum Tff7b72< Te6edf3minTb4b4b4) Te6edf3min Tff7b72= Te6edf3datumTb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3datum Tff7b72> Te6edf3maxTb4b4b4) Te6edf3max Tff7b72= Te6edf3datumTb4b4b4;
Tb4b4b4}
Te6edf3ctxTb4b4b4.Te6edf3moveToTb4b4b4(Te6edf3iTb4b4b4, Te6edf3amp Tff7b72+ Te6edf3min Tff7b72* Te6edf3ampTb4b4b4)Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3lineToTb4b4b4(Te6edf3iTb4b4b4, Te6edf3amp Tff7b72+ Te6edf3max Tff7b72* Te6edf3ampTb4b4b4)Tb4b4b4;
Tb4b4b4}
Te6edf3ctxTb4b4b4.Te6edf3strokeTb4b4b4(Tb4b4b4)Tb4b4b4;
T8b949e// Progress waveform (colored)
Tff7b72const Te6edf3progressX Tff7b72= Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3progressPercent Tff7b72/ T79c0ff100Tb4b4b4) Tff7b72* Te6edf3widthTb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3progressX Tff7b72> T79c0ff0Tb4b4b4) Tb4b4b4{
Te6edf3ctxTb4b4b4.Te6edf3beginPathTb4b4b4(Tb4b4b4)Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3strokeStyle Tff7b72= Te6edf3waveFgTb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3lineWidth Tff7b72= T79c0ff2Tb4b4b4;
Tff7b72for Tb4b4b4(Tff7b72let Te6edf3i Tff7b72= T79c0ff0Tb4b4b4; Te6edf3i Tff7b72< Te6edf3progressXTb4b4b4; Te6edf3iTff7b72++Tb4b4b4) Tb4b4b4{
Tff7b72let Te6edf3min Tff7b72= T79c0ff1.0Tb4b4b4;
Tff7b72let Te6edf3max Tff7b72= Tff7b72-T79c0ff1.0Tb4b4b4;
Tff7b72for Tb4b4b4(Tff7b72let Te6edf3j Tff7b72= T79c0ff0Tb4b4b4; Te6edf3j Tff7b72< Te6edf3stepTb4b4b4; Te6edf3jTff7b72++Tb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3datum Tff7b72= Te6edf3dataTb4b4b4[Te6edf3i Tff7b72* Te6edf3step Tff7b72+ Te6edf3jTb4b4b4]Tb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3datum Tff7b72< Te6edf3minTb4b4b4) Te6edf3min Tff7b72= Te6edf3datumTb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3datum Tff7b72> Te6edf3maxTb4b4b4) Te6edf3max Tff7b72= Te6edf3datumTb4b4b4;
Tb4b4b4}
Te6edf3ctxTb4b4b4.Te6edf3moveToTb4b4b4(Te6edf3iTb4b4b4, Te6edf3amp Tff7b72+ Te6edf3min Tff7b72* Te6edf3ampTb4b4b4)Tb4b4b4;
Te6edf3ctxTb4b4b4.Te6edf3lineToTb4b4b4(Te6edf3iTb4b4b4, Te6edf3amp Tff7b72+ Te6edf3max Tff7b72* Te6edf3ampTb4b4b4)Tb4b4b4;
Tb4b4b4}
Te6edf3ctxTb4b4b4.Te6edf3strokeTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3isDarkModeTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Tffa657documentTb4b4b4.Te6edf3documentElementTb4b4b4.Te6edf3classListTb4b4b4.Te6edf3containsTb4b4b4(Ta5d6ff"dark"Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3formatTimeTb4b4b4(Te6edf3secondsTb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3mins Tff7b72= Tffa657MathTb4b4b4.Te6edf3floorTb4b4b4(Te6edf3seconds Tff7b72/ T79c0ff60Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3secs Tff7b72= Tffa657MathTb4b4b4.Te6edf3floorTb4b4b4(Te6edf3seconds Tff7b72% T79c0ff60Tb4b4b4)Tb4b4b4;
Tff7b72return Ta5d6ff`Tffd700${Te6edf3minsTffd700}Ta5d6ff:Tffd700${Te6edf3secsTb4b4b4.Te6edf3toStringTb4b4b4(Tb4b4b4)Tb4b4b4.Te6edf3padStartTb4b4b4(T79c0ff2Tb4b4b4, Ta5d6ff"0"Tb4b4b4)Tffd700}Ta5d6ff`Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3togglePlayTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3isPlayingTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3stopPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4} Tff7b72else Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3startPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3startPlaybackTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72!Tff7b72thisTb4b4b4.Te6edf3audioBufferTb4b4b4) Tff7b72returnTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3stopPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3state Tff7b72=== Ta5d6ff"suspended"Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3resumeTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3sourceNode Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3createBufferSourceTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4.Te6edf3buffer Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioBufferTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4.Te6edf3connectTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3destinationTb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3startOffset Tff7b72= Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72>= Tff7b72thisTb4b4b4.Te6edf3totalDuration Tff7b72? T79c0ff0 Tff7b72: Tff7b72thisTb4b4b4.Te6edf3currentTimeTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3playbackStartOffset Tff7b72= Te6edf3startOffsetTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3playbackStartTime Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3currentTimeTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4.Te6edf3startTb4b4b4(T79c0ff0Tb4b4b4, Te6edf3startOffsetTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3isPlaying Tff7b72= Tff7b72trueTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3$emitTb4b4b4(Ta5d6ff"play"Tb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4.Te6edf3onended Tff7b72= Tb4b4b4(Tb4b4b4) Tb4b4b4=> Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3isPlayingTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3isPlaying Tff7b72= Tff7b72falseTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72= Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3progressPercent Tff7b72= T79c0ff100Tb4b4b4;
Te6edf3cancelAnimationFrameTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3animationFrameTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3updateProgressTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3stopPlaybackTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4) Tb4b4b4{
Tff7b72try Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3sourceNodeTb4b4b4.Te6edf3stopTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4} Tff7b72catch Tb4b4b4{
T8b949e// ignore
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3sourceNode Tff7b72= Tff7b72nullTb4b4b4;
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3isPlaying Tff7b72= Tff7b72falseTb4b4b4;
Te6edf3cancelAnimationFrameTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3animationFrameTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3updateProgressTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72!Tff7b72thisTb4b4b4.Te6edf3isPlayingTb4b4b4) Tff7b72returnTb4b4b4;
Tff7b72const Te6edf3elapsed Tff7b72= Tff7b72thisTb4b4b4.Te6edf3audioContextTb4b4b4.Te6edf3currentTime Tff7b72- Tff7b72thisTb4b4b4.Te6edf3playbackStartTimeTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72= Tffa657MathTb4b4b4.Te6edf3minTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3playbackStartOffset Tff7b72+ Te6edf3elapsedTb4b4b4, Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3progressPercent Tff7b72= Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72/ Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4) Tff7b72* T79c0ff100Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72>= Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3isPlaying Tff7b72= Tff7b72falseTb4b4b4;
Tff7b72returnTb4b4b4;
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3animationFrame Tff7b72= Te6edf3requestAnimationFrameTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3updateProgressTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3handleWaveformClickTb4b4b4(Te6edf3eTb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3canvas Tff7b72= Tff7b72thisTb4b4b4.Te6edf3$refsTb4b4b4.Te6edf3waveformTb4b4b4;
Tff7b72const Te6edf3rect Tff7b72= Te6edf3canvasTb4b4b4.Te6edf3getBoundingClientRectTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3x Tff7b72= Tffa657MathTb4b4b4.Te6edf3maxTb4b4b4(T79c0ff0Tb4b4b4, Tffa657MathTb4b4b4.Te6edf3minTb4b4b4(Te6edf3eTb4b4b4.Te6edf3clientX Tff7b72- Te6edf3rectTb4b4b4.Te6edf3leftTb4b4b4, Te6edf3rectTb4b4b4.Te6edf3widthTb4b4b4)Tb4b4b4)Tb4b4b4;
Tff7b72const Te6edf3time Tff7b72= Tb4b4b4(Te6edf3x Tff7b72/ Te6edf3rectTb4b4b4.Te6edf3widthTb4b4b4) Tff7b72* Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72= Te6edf3timeTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3progressPercent Tff7b72= Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3currentTime Tff7b72/ Tff7b72thisTb4b4b4.Te6edf3totalDurationTb4b4b4) Tff7b72* T79c0ff100Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3isPlayingTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3startPlaybackTb4b4b4(Tb4b4b4)Tb4b4b4; T8b949e// Restart from new position
Tb4b4b4} Tff7b72else Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3drawWaveformTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4<Tb4b4b4/Tff7b72scriptTb4b4b4>
Tb4b4b4<Tff7b72style Te6edf3scopedTb4b4b4>
Tff7b72canvas Tb4b4b4{
Tff7b72image-renderingTb4b4b4: Tff7b72autoTb4b4b4;
Tb4b4b4}
Tb4b4b4<Tb4b4b4/Tff7b72styleTb4b4b4>
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────